<div id='processModelInfo' ng-controller="ProcessModelDetailCtrl" >
	<input type="hidden" id="processMdoelId" value="{{pm.id}}" >
	<input type="hidden" id="isShowStartForm" value="{{pm.isShowStartForm}}" >
	<input type="hidden" id="wizardData" value="{{wizardData}}" >
	<div class="wrapper bg-light lter b-b" style="padding:10px;height:55px;" >
		<ul class="breadcrumb" style="display: block;float:left;background:none;margin-bottom: 0px;">
			<li><a ui-sref="app.news" ><i class="iconfont icon-xinwen"></i> {{'aside.nav.news'|translate}}</a></li>
			<li><a ui-sref="app.processmodellist" ><i class="fa  fa-sitemap"></i> <span translate="aside.nav.processModel"></span></a></li>
			<li><a ui-sref="app.processmodeldetail({processModelId:pm.id})" > {{pm.name}}</a></li>
			<li class="active"> <span  translate='processModel.processModelDetail'></span> &nbsp;&nbsp;&nbsp;<a ui-sref="app.processmodellist" class="text-info" ><i class="icon-action-undo"></i> {{'common.blackList'|translate}}</a></li>
		</ul>
		<div class="btn-group pull-right" >
			<ul class="nav nav-tabs" style="position: relative;bottom: -6px;border-bottom:0px;"  >
				<li class="ng-isolate-scope">
					<a ui-sref="app.processmodelstart({processModelId:pm.id,processParameter:0})" style="border-bottom: 0px;" class="ng-binding ng-click-active">
						<i class="fa fa-list-alt icon "></i> <span  translate='processModel.processInitiatingPage'></span>
					</a>
				</li>
				<li class="ng-isolate-scope active">
					<a ui-sref="app.processmodeldetail({processModelId:pm.id})" style="border-bottom: 0px;" class="ng-binding ng-click-active">
						<i class="fa fa-info-circle"></i> <span  translate='processModel.processModelDetail'></span>
					</a>
				</li>
				<li ng-show="pm.dashboardPageId!=null" class="ng-isolate-scope">
					<a ui-sref="app.processmodeldashboard({processModelId:pm.id})" style="border-bottom: 0px;" class="ng-binding ng-click-active">
						<i class="fa fa-bar-chart-o"></i> <span  translate='processModel.processModelDashboard'></span>
					</a>
				</li>
			</ul>
		</div>
	</div>
	<div  >
	<div style="padding:15px;clear:both;padding-bottom: 0px;" >
		<div id="wizard">
			<div id="scroller">
				<div class="console-step row step-bar">
					<div class="step step-active" ><span class="ng-binding">{{'process.start'|translate}}</span></div>
					<div class="step"  ng-repeat="milestone in wizardData.milestones"><span class="ng-binding">{{milestone.name}}</span></div>
					<div class="step"   ><span class="ng-binding">{{'process.end'|translate}}</span></div>
				</div>
			</div>
		</div>
	</div>
	<div class="info-panel" ng-class="processPriorityPanel(pp.priority)" >
		<div class="ng-binding">
			<a href ui-toggle-class class="m-xs" style="font-size: 15px;" ng-click="setFavorite(pm.id,pm.favorite)" ng-class="isFavorite(pm.favorite)" >
				<i class="fa fa-star text-warning text-active" ></i>
				<i class="fa fa-star-o  text" style="color:#98a6ad;"  ></i>
			</a>
			{{'processModel.processModelName'|translate}} : <span style="color:#999;" >{{pm.name}}</span>
			<span style="margin-left: 20px;" >{{'processModel.updateTime'|translate}} : <span style="color:#999;" >{{pm.updatedTime}}</span></span>
			<span style="margin-left: 20px;" ><a class="text-info" ui-sref="app.processmodelstart({processModelId:pm.id,processParameter:0})"  >{{'processModel.theProcessInitiated'|translate}}</a></span>
		</div>
		<div class="m-t" style="margin-left: 27px;" >
				{{'processModel.processModelDescription'|translate}} : <span style="color:#999;" >{{pm.description}}</span>
		</div>
	</div>
	<div class="info-panel" style="-webkit-overflow-scrolling:touch;-webkit-overflow: auto;overflow: auto;padding: 5px;">
			<iframe id="processModelDetailChart"  width="100%" frameborder="0" height="550"  scrolling="no" ></iframe>
	</div>
	</div>
</div>
<script>
	$(function(){
		var myScroll = new IScroll('#wizard', { eventPassthrough: true, scrollX: true, scrollY: false, preventDefault: false });
	});
</script>







